上一篇說到App的設計，今天開始按照設計圖來製作App的畫面，首先從首頁做起。

<View>標籤雖然可以利用StyleSheet設定樣式顏色，但無法加入底圖，如果使用<Image>這個標籤又只能加入圖片無法在其內新增內容，這時候就需要用到<ImageBackground>這個標籤了。<ImageBackground>的用法為：

<ImageBackground style={{flex: 1}} source={require('../../assets/bg_all.png')}>
  <Text>內容</Text>
</ImageBackground>

• style的標籤格式不一定要透過StyleSheet宣告，可直接寫在標籤內，此段程式裡的flex: 1的意思是要讓底圖符合畫面大小
• source參數顧名思義是要填入圖片來源，用require()可以根據檔案路徑找到指定的檔案。

&小重點：require()與uri用途的差別

<Image>與<ImageBackground>標籤都需設定source參數來告訴電腦你需要哪張圖片，主要有兩種呼叫方式：
1. require()
當你要呼叫的圖片是儲存在本地電腦裡的時候，要用的就是require()，程式寫法是：

<ImageBackground source=require('檔案路徑')> </ImageBackground>

2. uri
當你要的圖片是位在網路上的時候，要用的就是uri，程式的寫法是：

<ImageBackground source={{ uri: '檔案所在地的網址' }}> </ImageBackground>

＊小提醒：ImageBackground標籤位於react-native.js記得要import才可以使用喔！